<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>易见股份舆情系统V1.0</title>
    <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport"/>
    <meta content="yes" name="apple-mobile-web-app-capable"/>
    <meta content="black" name="apple-mobile-web-app-status-bar-style"/>
    <meta content="telephone=no" name="format-detection"/>
    <link href="/favicon.ico" rel="icon" type="image/x-icon"/>

    {{scripts('resources/views/wap/js/jquery.js', 'wap')}}
    {{scripts('resources/views/wap/js/mobiscroll.js', 'wap')}}

    {{sass('resources/views/wap/style/mobiscroll.css', 'wap')}}
    {{sass('resources/views/wap/style/style.css', 'wap')}}

</head>
<body>
<div class="preloader">
    <div class="spinner"></div>
</div>

<div class="logo">
    <img src="/static/logo.png"/>
</div>

<div class="search">
    <div class="left">
        <div class="section">
            <select id="demo_select">
                <option value="0">全部来源</option>
                @foreach($sites as $_site)
                    <option value="{{$_site['id']}}">{{$_site['name']}}</option>
                @endforeach
            </select>
        </div>
        <div class="section">
            <input type="text" id="demo_date" placeholder="请选择日期"/>
        </div>
    </div>
    <button class="button" onclick="search();"></button>
    <input type="hidden" value="0" id="show_page">
</div>

<!---展示内容--->
<div class="con">

</div>


<!--<div class="more">没有更多了</div>-->

<script>
    $(function () {
        // preloader
        $(".preloader").fadeOut();
    });

    var theme = "ios";
    var mode = "scroller";
    var display = "bottom";
    var lang = "zh";
    var is_running = false
    // Select demo initialization
    $('#demo_select').mobiscroll().select({
        theme: theme,
        mode: mode,
        display: display,
        lang: lang
    });
    // Date demo initialization
    $('#demo_date').mobiscroll().date({
        theme: theme,
        mode: mode,
        display: display,
        lang: lang
    });

    // 滚动加载更多
    $(window).scroll(function () {
        var scrollTop = $(this).scrollTop();
        var scrollHeight = $(document).height();
        var windowHeight = $(this).height();
        if (scrollTop + windowHeight + 5 >= scrollHeight) {
            //此处是滚动条到底部时候触发的事件，在这里写要加载的数据，或者是拉动滚动条的操作
           if(is_running===false){
               is_running = true
               addmore();
           }
        }
    });


    // 加载更多
    addmore()

    // 执行搜索
    function search() {
        $('#show_page').val(0);  // 重新开始搜索
        $(".con").html('');  // 先清空页面
        addmore()
    }


    // 加载更多
    function addmore() {
        $(".preloader").fadeIn().fadeOut();
        //var rows = $('#show_rows').val();
        var page = parseInt($('#show_page').val()) + parseInt(1);
        var rows = 6;
        let site_id = $('#demo_select').val();
        let date = $('#demo_date').val();

        $.ajax({
            type: 'post',
            url: '/home/on-lists',
            data: {page: page, size: rows, site_id: site_id, start_date: date},
            //contentType: 'application/json',
            contentType: 'application/x-www-form-urlencoded',
            // dataType : 'json',
            // contentType: 'application/x-www-form-urlencoded',
            // 这个方法在请求发送前调用，可以用来做表单校验、用来做请求等待动画的调用
            /*beforeSend: function () {
                // 返回false是取消发送
                return false
            },*/
            withCredentials: true,
            // 自定义 header
            beforeSend: function (request) {
                //request.setRequestHeader("Terminal","android");
                //request.setRequestHeader("Token","");
            },
            // 会自动帮我们把返回的数据根据响应头设置的类型进行转换好（也就是会自动转成json对象）
            success: function (res) {
                //console.log('返回结果', res)
                $(".con").append(res)
                //$(".con").html(res)

                // 当前页
                $('#show_page').val(page);
                is_running = false
            },
            // xhr是ajax对象
            error: function (xhr) {
            }
        });
    }
</script>

</body>
</html>
